<template>
    <div class="howtoaddSupplier">
        <div class="title">添加供应商及分销商</div>
		<div class="content">
			<div class="flex">
				<div class="bold big">1、添加供应商</div>
			</div>
			<div class="flex">
				您可通过菜单“我的供应商——添加供应商”来添加，需要输入“供应商代码”请联系您的供应商获取。
			</div>
			<img :src="howtoaddSupplier1" style="width:500px;">
			<div class="title2">
				注：如果您的供应商未加入平台，您可邀请其创建店铺加入到我们的订单管理平台
			</div>
			
			<div class="flex">
				<div class="bold big">2、添加分销商</div>
			</div>
			<div class="flex">
				您需要把自己的供应商代码提供给您的分销商，让他们将您添加为供应商。
			</div>
			<div class="flex">
				（1）邀请您的分销商注册我们的平台店铺，提供您的供应商代码给对方，按照上方添加供应商的路径添加供应商
			</div>
			<div class="flex">
				（2）您也可以直接使用推广链接，对方注册后默认成为您的分销商。
			</div>
			
			<img :src="howtoaddSupplier2"  style="width:800px;">
			<div class="title2">
				注：如果您的供应商未加入平台，您可邀请其创建店铺加入到我们的订单管理平台
			</div>
			

			
		</div>
    </div>
</template>

<script>
    import axios from "axios";
    export default{
    	name: 'howtoaddSupplier',
    	data(){
    		return{
				howtoaddSupplier1:'./static/help/howtoaddSupplier1.png',
				howtoaddSupplier2:'./static/help/howtoaddSupplier2.png',
    		}
    	},
    	created() {
    		
    	},
        methods:{
           
        }
    }
</script>

<style lang="scss" scoped>
	.howtoaddSupplier{ font-size: 14px;
		.titleh{ line-height: 60px; font-size: 26px; color: #4D4D4D; text-align: center;}
    background: #F1F1F1;
    font-size: 14px;
    
    .exit {
      margin-left: 20px;
      cursor: pointer;
      color: #77C9FF;
    }
    
    .flex {
      display: flex;
      flex-wrap: wrap;
    }
    
    .w1350 {
      width: 1350px;
      margin: 0 auto;
    }
    
    .top {
      height: 30px;
      line-height: 30px;
    }
    
    .logo {
      background: #42628D;
      padding: 20px 0;
    }
    
    .center {
      padding: 30px 0;
    
      .hleft {
        background: #fff;
        width: 330px;
        box-sizing: border-box;
        padding-top: 10px;
        color: #77C9FF;
        border-radius: 5px;
        box-shadow: 0 0 5px #ccc;
    
        .title {
          padding-bottom: 20px;
          padding-top: 20px;
          font-size: 16px;
          font-weight: bold;
          padding-left: 35px;
        }
    
        .nav:hover {
          background: #F1F1F1;
        }
    
        .nav {
          line-height: 40px;
          padding-left: 35px;
          display: block;
          color: #77C9FF;
        }
    
        .router-link-active {
          background: #F1F1F1 !important;
        }
      }
    
      .hright {
        background: #fff;
        justify-content: space-between;
        width: 1000px;
        box-sizing: border-box;
        margin-left: 20px;
        border-radius: 5px;
        box-shadow: 0 0 5px #ccc;
        padding-bottom: 30px;
    
        img {
          width: 100%;
          display: block;
          margin: 20px 0;
        }
    
        .title {
          padding: 15px 30px;
          font-size: 18px;
          color: #4D4D4D;
          border-bottom: 1px #DBDBDB solid;
        }
    
        .title2 {
          color: #FF6161;
          font-weight: bold;
        }
    
        .title4 {
          color: #FF7777;
          font-size: 14px
        }
    
        .bold {
          font-weight: bold;
        }
    
        .content {
          padding: 0 35px;
          line-height: 50px;
        }
    
        .nei {
          padding-left: 60px;
        }
    
        .blue {
          color: #77C9FF;
        }
    
        .title3 {
          font-size: 16px;
        }
    
        .big {
          font-size: 18px;
          padding: 20px 0;
        }
      }
    }
	}
</style>
